/*
 * @Author: mengqingchen mengqingchen@huaru.cc
 * @Date: 2022-08-08 14:53:06
 * @LastEditors: mengqingchen mengqc1995@163.com
 * @LastEditTime: 2023-02-20 20:36:19
 * @FilePath: \sososn-web-new\vite.config.js
 * @Description:
 */
import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from 'path' // 主要用于alias文件路径别名

import viteCompression from 'vite-plugin-compression'
import eslintPlugin from 'vite-plugin-eslint'
import Icons from 'unplugin-icons/vite'
import IconsResolver from 'unplugin-icons/resolver'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
import viteImagemin from 'vite-plugin-imagemin'

const pathSrc = resolve(__dirname, 'src')

// https://vitejs.dev/config/
// export default defineConfig();
export default ({ mode }) => {
  const env = loadEnv(mode, process.cwd())
  const { VITE_USER_NODE_ENV } = env
  return defineConfig({
    plugins: [
      vue(),
      eslintPlugin({
        include: ['src/**/*.js', 'src/**/*.vue', 'src/*.js', 'src/*.vue'],
        cache: false,
        fix: true
      }),

      viteCompression({
        ext: '.gz',
        algorithm: 'gzip',
        deleteOriginFile: false
      }),

      viteImagemin({
        gifsicle: {
          optimizationLevel: 7,
          interlaced: false
        },
        optipng: {
          optimizationLevel: 7
        },
        mozjpeg: {
          quality: 20
        },
        pngquant: {
          quality: [0.8, 0.9],
          speed: 4
        },
        svgo: {
          plugins: [
            {
              name: 'removeViewBox'
            },
            {
              name: 'removeEmptyAttrs',
              active: false
            }
          ]
        }
      }),

      AutoImport({
        // 这里除了引入 vue 以外还可以引入pinia、vue-router、vueuse等，
        imports: ['vue', 'vue-router', 'vuex'],
        eslintrc: {
          enabled: true, //设置为ture
          filepath: './.eslintrc-auto-import.json',
          globalsPropValue: true
        },
        // 自动导入 Element Plus 相关函数，如：ElMessage, ElMessageBox... (带样式)
        resolvers: [
          ElementPlusResolver(),
          // 自动导入图标组件
          IconsResolver({
            prefix: 'Icon'
          })
        ]
      }),

      Components({
        // 配置需要将哪些后缀类型的文件进行自动按需引入
        extensions: ['vue'],
        resolvers: [
          // 自动注册图标组件
          IconsResolver({
            prefix: 'icon',
            enabledCollections: ['ep']
          }),
          ElementPlusResolver()
        ]
      }),
      Icons({
        autoInstall: true,
        compiler: 'vue3'
      }),

      createSvgIconsPlugin({
        // 指定需要缓存的图标文件夹
        iconDirs: [resolve(process.cwd(), './src/icons')],
        // 指定symbolId格式
        symbolId: 'icon-[dir]-[name]'
      })
    ],
    define: { 'process.env': {} },
    resolve: {
      alias: {
        '@': pathSrc
      }
    },
    //静态资源服务的文件夹
    publicDir: 'public',
    base: VITE_USER_NODE_ENV === 'production' ? './' : '/',
    //静态资源处理
    assetsInclude: '',
    //控制台输出的级别 info 、warn、error、silent
    logLevel: 'info',
    // 设为false 可以避免 vite 清屏而错过在终端中打印某些关键信息
    clearScreen: true,
    // 强制预构建插件包

    optimizeDeps: {
      include: ['vue', 'axios', 'vue-router'],
      esbuildoptions: {
        target: 'es2020'
      }
    },

    // 打包配置
    build: {
      target: 'es2020',
      // target: 'modules',
      outDir: 'dist', //指定输出路径
      assetsDir: 'static', // 指定生成静态资源的存放路径
      //小于此阈值的导入或引用资源将内联为 base64 编码，以避免额外的 http 请求。设置为 0 可以完全禁用此项
      assetsInlineLimit: 4096,
      //启用/禁用 CSS 代码拆分
      cssCodeSplit: true,
      //构建后是否生成 source map 文件
      sourcemap: false,
      //自定义底层的 Rollup 打包配置
      rollupOptions: {},
      //@rollup/plugin-commonjs 插件的选项
      commonjsOptions: {},
      //当设置为 true，构建后将会生成 manifest.json 文件
      manifest: false,
      // 设置为 false 可以禁用最小化混淆，
      // 或是用来指定使用哪种混淆器
      // boolean | 'terser' | 'esbuild'
      minify: 'terser', //terser 构建后文件体积更小
      //传递给 Terser 的更多 minify 选项。
      terserOptions: {
        compress:
          VITE_USER_NODE_ENV === 'production'
            ? {
                //生产环境时移除console
                drop_console: true,
                drop_debugger: true
              }
            : {}
      },
      //设置为 false 来禁用将构建后的文件写入磁盘
      write: true,
      //默认情况下，若 outDir 在 root 目录下，则 Vite 会在构建时清空该目录。
      emptyOutDir: true,
      //启用/禁用 brotli 压缩大小报告
      brotliSize: true,
      //chunk 大小警告的限制
      chunkSizeWarningLimit: 2000
    },
    // 本地运行配置，及反向代理配置
    server: {
      host: '0.0.0.0',
      https: false, //是否启用 http 2
      cors: true, //为开发服务器配置 CORS , 默认启用并允许任何源
      open: true, //服务启动时自动在浏览器中打开应用
      port: '9000',
      strictPort: false, //设为true时端口被占用则直接退出，不会尝试下一个可用端口
      //force: true, //是否强制依赖预构建
      hmr: true, //禁用或配置 HMR 连接(热更新是否开启)
      //反向代理配置，注意rewrite写法，开始没看文档在这里踩了坑
      proxy: {
        '/dev-api': {
          // target: 'http://malltestserver.hrhydata.com/', //代理接口
          // target: 'http://47.122.0.54:8700/',
          target: 'http://192.168.4.56:8081/', //曹鑫磊
          // target: 'http://192.168.4.173:8081/', //肖昂
          changeOrigin: true,
          rewrite: path => path.replace(/^\/dev-api/, '')
        }
      }
    },
    css: {
      // postcss: {
      //   plugins: [
      //     postCssPxToRem({
      //       rootValue: 192,
      //       propList: [
      //         "*",
      //         // "!font*",
      //         "!min-width*",
      //         "!border*",
      //       ], // 需要转换的属性，这里选择全部都进行转换
      //       selectorBlackList: ["el"],
      //     }),
      //   ],
      // },
    }
  })
}
